import { createRouter, createWebHistory } from 'vue-router'
import { home } from '@/router/home.js'
import { category } from '@/router/category.js'
import { cart } from '@/router/cart.js'
import { mine } from "@/router/mine.js"


const routeA = [
    // // 将匹配所有内容并将其放在 `$route.params.pathMatch` 下
    // { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
    // // 将匹配以 `/user-` 开头的所有内容，并将其放在 `$route.params.afterUser` 下
    // { path: '/user-:afterUser(.*)', component: UserGeneric },
    //这有一个注意事项。你的服务器将不再报告 404 错误，因为现在所有未找到的路径都会显示你的 index.html 文件。为了解决这个问题，你应该在你的 Vue 应用程序中实现一个万能的路由来显示 404 页面。
    // {
    //   path: '/:pathMatch(.*)',
    //   component: NotFoundComponent
    // },
    {
      path: '/',
      redirect: '/home'//重定向
      //在 vuea Router 的路由配置中，‘redirect 属性用于指定在访问某个路由路径时，应该重定向到另一个路径。
      // 当你给路由配置添加‘redirect 属性时，它会告诉Vue Router， 如果访问了当前路径(path'），则应该立即
      // 重定向到'redirect 指定的路径。
    }
  ]

const routes = [...routeA, ...home, ...category, ...cart, ...mine];

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes,
  // 路由滚动行为定制
  scrollBehavior () {
    return {
      top: 0
    }
  },
  //tabbar选中颜色
  linkActiveClass: 'themecolor'
})


/* 路由发生变化修改页面title */ // 全局导航守卫
router.beforeEach( async (to, from, next) => {
  // console.log('----' + to.meta.title + '----');
  if (to.meta.title) {
    document.title = to.meta.title
    next()
  } else { 
    // 返回 false 以取消导航
    return false
  }
})


// 全局后置钩子  
//该函数会在每次路由切换成功进入激活阶段时被调用
router.afterEach((to, from, failure) => { 
  // console.log('路由切换成功');
  // if (!failure) sendToAnalytics(to.fullPath)
})

export default router
